/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

@import '~antd/lib/style/themes/default.less';

// input-number 移动端体验

@input-handler-width: 30px;
@input-handler-size: 22px;

@sm-input-handler-width: 20px;
@sm-input-handler-size: 12px;

.input {
  &-number {
    &:global(.ant-input-number) {
      &:hover {
        :global(.ant-input-number-handler) {
          border-color: @primary-color;
        }
      }
    }
    :global {
      .ant-input-number {
        &-input {
          text-align: center;
          &-wrap {
            padding: 0 @input-handler-width;
          }
        }
        &-handler {
          position: absolute;
          top: 0;
          z-index: 1;
          display: flex;
          align-items: center;
          justify-content: center;
          width: @input-handler-width;
          color: @color-grey-1;
          font-weight: normal;
          font-size: @input-handler-size;
          border: none;
          &::before {
            margin-top: -2px;
          }
          &:hover:not(.ant-input-number-handler-down-disabled, .ant-input-number-handler-up-disabled) {
            color: @primary-color;
          }
          .anticon {
            display: none !important;
          }
          &,
          &:hover {
            height: 100% !important;
          }
          &-up,
          &-down {
            &-disabled {
              color: #eee;
              &:active {
                background: transparent;
              }
            }
          }
          &-up {
            right: 0;
            border-left: 1px solid #ddd;
            &::before {
              content: '+';
            }
          }
          &-down {
            left: 0;
            border-top: none !important;
            border-right: 1px solid #ddd;
            &::before {
              content: '-';
            }
          }
          &-wrap {
            position: static;
            width: 0;
            opacity: 1;
          }
        }
        // 兼容移动端（手动补充点击按钮）
        &-group-addon {
          position: static;
          width: 0;
          padding: 0;
          background-color: transparent;
          border: none;
        }
      }
    }

    &:global(.ant-input-number-sm) {
      :global {
        .ant-input-number {
          &-input {
            font-size: @sm-input-handler-size;
            text-align: center;
            &-wrap {
              padding: 0 @sm-input-handler-width;
            }
          }
          &-handler {
            width: @sm-input-handler-width;
            font-size: @sm-input-handler-size;
          }
        }
      }
    }
  }
}
